<!DOCTYPE html>
<html ng-app="bee_console">
<head>
    <meta charset="UTF-8">
    <title>{$ site_title $}</title>
    {% load staticfiles %}
    {#    <link href='http://fonts.googleapis.com/css?family=Dancing+Script|Audiowide|Playball' rel='stylesheet' type='text/css'>#}
    <link href="{% static 'semantic/css/semantic.css' %}" rel="stylesheet">
    <link href="{% static 'css/jquery.mCustomScrollbar.css' %}" rel="stylesheet">
    <link href="{% static 'css/animate.css' %}" rel="stylesheet">
    <link href="{% static 'console/style.css' %}" rel="stylesheet">
    <link href="{% static 'console/ui-component.css' %}" rel="stylesheet">
</head>
<body>

<header class="ui grid">
    <div class="three wide column">
        <div class="logo">
            Raccoon
        </div>
    </div>

</header>


<div ng-controller="sidebar_nav" class="main">
    <div class="side_bar" ng-class="{collapse : if_collapse }">
        <div class="side_bar_menu">
            <a ng-repeat="menu in menus " ng-class="{active: '{$ menu.code $}' === currentMenu }" class="item" ng-click="sidebar_menu_nav(menu)" ng-href="{$ menu.url $}">
                <i class="{$ menu.icon $} icon"></i><span class="collapse_hide">{$ menu.title $}</span>
            </a>

        </div>
        <div class="side_bar_footer">
            <hr/>
            <div class="side_bar_footer_menu">
                <div class="item collapse_hide">
                    <i class="inbox icon"></i>
                </div>
                <div class="item collapse_hide">
                    <i class="sitemap icon"></i>
                </div>

                <div class="item toggle" ng-click="js_sidebar_collapse()">
                    <i class="step icon" ng-class="{backward: !if_collapse , forward : if_collapse}"></i>
                </div>


            </div>
        </div>
    </div>

    <div class="container" ng-class="{collapse : if_collapse }">
        <div class="inner">
            <ng-view>

            </ng-view>

        </div>

    </div>
</div>


<script type="text/javascript" src="{% static 'js/jquery-1.11.1.min.js' %}"></script>
<script type="text/javascript" src="{% static 'js/jquery.mCustomScrollbar.concat.min.js' %}"></script>
<script type="text/javascript" src="{% static 'semantic/javascript/semantic.js' %}"></script>
<script type="text/javascript" src="{% static 'console/js/angular/angular.js' %}"></script>
<script type="text/javascript" src="{% static 'console/js/angular-route/angular-route.js' %}"></script>
<script type="text/javascript" src="{% static 'console/js/ui-bootstrap-tpls-0.11.0.js' %}"></script>
<script type="text/javascript" src="{% static 'console/js/app/cached-template.js' %}"></script>
<script type="text/javascript" src="{% static 'console/js/app/dashboard.js' %}"></script>
<script type="text/javascript" src="{% static 'console/js/app/explore.js' %}"></script>
<script type="text/javascript" src="{% static 'console/js/app/resume.js' %}"></script>
<script type="text/javascript" src="{% static 'console/js/app/project.js' %}"></script>
<script type="text/javascript" src="{% static 'console/js/app/ui-component.js' %}"></script>
<script type="text/javascript" src="{% static 'console/js/app/app.js' %}"></script>

<script>
    $(document).ready(function () {

        $('.main').css({
            height: window.document.body.clientHeight - 60

        });
        $(window).resize(function (event) {
            /* Act on the event */
            $('.main').css({
                height: window.document.body.clientHeight - 60

            });

        });

        $('.scoller_pannel').mCustomScrollbar({
            theme:"minimal-dark"
        })

    });

</script>

</body>
</html>